<!-- 头部搜索组件 -->
<template>
  <div class="headerSerch">
    <input type="text" v-model.trim="keyword" />
    <button @click="search">搜索</button>
  </div>
</template>

<script>
export default {
  name: "HeaderSearch",
  data() {
    return {
      keyword: "",
    };
  },
  methods: {
    // 搜索页切换
    search() {
      if(this.keyword != this.$route.query.wd){
        this.$router.push({name:'search',query:{wd:this.keyword}})
      }
    },
    
  },
};
</script>
<style>
.headerSerch {
  width: 80%;
  float: left;
}

.headerSerch input {
  height: 26px;
  width: 80%;
}

.headerSerch button {
  height: 34px;
  width: 17%;
  color: gainsboro;
  background: rgba(0, 0, 0, 0.5);
}
</style>

